<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<title>字典中心</title>
<head th:replace="common/incHead :: incHead"></head>
<body class="ok-body-scroll console">
<div class="ok-body home">
    <div class="layui-row">
        <div class="layui-col-md3">
            <div class="layui-card">
                <div class="layui-card-header">
                    <div class="ok-card-title">
                        字典信息
                        <div class="layui-btn-container p-t-xxs pull-right">
                            <button class="layui-btn layui-btn-primary layui-border-orange layui-btn-sm pa-bar-cond pull-right">
                                <div class="pull-left pa-bar-cond-input"><input placeholder="请输入检索条件" class="layui-input" type="text" name="sv" id="sv" th:value="${sv}"></div>
                                <div class="pull-left pa-bar-cond-icon SearchBox"><i class="layui-icon layui-icon-search "></i></div>
                            </button>
                        </div>
                    </div>
                </div>
                <div class="ok-card-body" layoutH="75">
                    <ul class="folder-list" style="padding: 0">
                        <li class="p-xxs" th:each="item:${codes}">
                            <a href="javascript:" th:if="${parent.id} == ${item.id}"><i class="layui-icon layui-icon-link"></i>
                                <selection class="text-info">[[${item.codeSort}]]:[[${item.codeKey}]]【[[${item.codeValue}]]】</selection>
                            </a>
                            <a th:href="@{/sys/code(pid=${item.id},sv=${sv})}" th:if="${parent.id} != ${item.id}"><i class="layui-icon layui-icon-link"></i>
                                <selection class="">[[${item.codeSort}]]:[[${item.codeKey}]]【[[${item.codeValue}]]】</selection>
                            </a>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
        <div class="layui-col-md9 p-l-sm">
            <div class="layui-card">
                <div class="layui-card-header">
                    <div class="ok-card-title">
                        <div class="layui-btn-container p-t-xxs">
                            <button th:if="${@lj.limit('SysCodeAdd')>0}" class="layui-btn layui-btn-sm layui-btn-normal" ljUrl="/sys/code/add?pid=0" title="添加顶级字典" ljWidth="600px" ljHeight="650px" target="ljOpenSubmit">
                                <i class="layui-icon layui-icon-add-circle"></i>添加顶级字典
                            </button>
                            <button th:if="${@lj.limit('SysCodeEdit')>0} and ${parent}" class="layui-btn layui-btn-sm " th:ljUrl="|/sys/code/edit?id=${parent?.id}|" title="编辑字典" ljWidth="600px" ljHeight="650px"
                                    target="ljOpenSubmit">
                                <i class="layui-icon layui-icon-add-circle"></i>编辑顶级字典
                            </button>
                            <button th:if="${@lj.limit('SysCodeDel')>0} and ${parent}" class="layui-btn layui-btn-sm layui-btn-danger" th:ljUrl="|/sys/code/del?id=${parent?.id}|" title="删除字典" target="ljAjaxTodo"><i
                                    class="layui-icon layui-icon-add-circle"></i>删除顶级字典
                            </button>
                            <button th:if="${@lj.limit('SysCodeFlush')>0}" class="layui-btn layui-btn-sm layui-btn-warm m-l-sm " ljUrl="/sys/code/flush" title="确认要刷新系统缓存吗?" target="ljAjaxTodo"><i
                                    class="layui-icon layui-icon-add-circle"></i>刷新缓存
                            </button>
                            <button th:if="${@lj.limit('SysCodeFlush')>0} and ${parent}" class="layui-btn layui-btn-sm layui-btn-checked" th:ljUrl="|/sys/code/add?pid=${parent?.id}|" title="新增子字典?" ljWidth="600px"
                                    ljHeight="650px" target="ljOpenSubmit"><i class="layui-icon layui-icon-add-circle"></i>新增子字典
                            </button>
                            <button class="layui-btn layui-btn-sm layui-btn-normal pull-right btnPageRefresh" lay-event="reload"><i class="layui-icon layui-icon-search"></i>刷新页面</button>
                        </div>
                    </div>
                </div>
                <div class="ok-card-body">
                    <div class="layui-row ljLayTableBox">
                        <table class="layui-hide" id="indexTable" lay-filter="indexTable"></table>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div th:replace="common/incBottom :: incBottom"></div>
<script th:inline="javascript">
    /*<![CDATA[*/
    var indexData = [];
    /*[# th:each="item,itemStat:${childCodes}"]*/
    indexData.push({
        id: [[${item.id}]],
        codeKey: [[${item.codeKey}]],
        codeValue: [[${item.codeValue}]],
        codeDesc: [[${item.codeDesc}]],
        codeSort: [[${item.codeSort}]],
        codeTags: [[${item.codeTags}]],
        createTime: [[${@lj.date(item.createTime)}]]
    });
    /*[/]*/
    /*]]>*/
</script>
<script th:inline="none">
    layui.use(["element", "jquery", "table", "okLayer", "okPapper"], function () {
        let table = layui.table;
        let okPapper = layui.okPapper;
        let $ = layui.jquery;
        okLoading.close($);
        table.render({
            elem: '#indexTable',
            data: indexData,
            height: 'full-98',
            page: false,
            limit: indexData.length,
            toolbar: false,
            size: "sm",
            cols: [[
                {field: "id", title: "编号", fixed: "left", width: 60},
                {field: "codeKey", title: "字典定义", fixed: "left", width: 120},
                {field: "codeValue", title: "字典值", fixed: "left", width: 150},
                {field: "codeSort", title: "字典排序", width: 100},
                {field: "codeDesc", title: "字典描述", width: 150},
                {field: "codeTags", title: "字典标签", minWidth: 150},
                {field: "createTime", title: "添加时间", width: 150},
                {title: "操作", width: 150, align: "center", fixed: "right", templet: "#operationTpl"}
            ]],
            done: function (res, curr, count) {
            }
        });
        okPapper.init();
    })
</script>
<script>
    layui.use(["jquery"], function () {
        let $ = layui.jquery;
        $(".SearchBox").on("click", function () {
            let sv = $("#sv").val();
            window.location.href = "/sys/code?pid=[[${parent?.id}]]&sv=" + sv;
        });
        $('#sv').on('keypress', function (event) {
            if (event.keyCode == 13) {
                let sv = $("#sv").val();
                window.location.href = "/sys/code?pid=[[${parent?.id}]]&sv=" + sv;
            }
        });
    })
</script>
<!-- 默认统一操作模板 -->
<script type="text/html" id="operationTpl">
    <button th:if="${@lj.limit('SysCodeEdit') gt 0}" class="layui-btn layui-btn-xs" title="字典编辑:{{d.id}}" ljUrl="/sys/code/edit?id={{d.id}}" ljWidth="600px" ljHeight="400px" target="ljOpenSubmit">
        <i class="layui-icon layui-icon-edit"></i>编辑
    </button>
    <button th:if="${@lj.limit('SysCodeDel') gt 0}" class="layui-btn layui-btn-xs layui-btn-danger" title="确认要删除该字典吗?" ljUrl="/sys/code/del?id={{d.id}}" target="ljAjaxTodo">
        <i class="layui-icon layui-icon-delete"></i>删除
    </button>
</script>
</body>
</html>